<!-- 
  v-show: <表达式>

  当需要在显示和隐藏之间 切片很频繁是，使用 v-show
  只有一次切换，使用 v-if(常用：根据服务器回传的数据，决定某个 元素都是显示，不是手动切换的)
  -----------------------------

  使用 google ，输入  app.isShow = false,看变化

  ------------------------------
  v-if： 当条件为 false 时，包含v-fi指令的元素，根本就不会存在dom中

  v-show： 当条件为 false 时，v-show 只是给我们的元素添加一个行内样式: display: none
 -->

 <!DOCTYPE html>
 <html lang="en">
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Document</title>
 </head>
 <body>
   <div id="app">
     <h2 key='aa' v-if="isShow">aaaaaaaaaaa</h2>
     <h2 key='bb' v-show="isShow">bbbbbbbbbbb</h2>
   </div>

   <script src="../../js/vue.js" ></script>
   <script>
     const app = new Vue({
      el: '#app',
      data: {
        isShow: true
      }
     })
   </script>
 </body>
 </html>